<!DOCTYPE html>
<!--
@name:
@description:
@author: lzy
@title: 天王盖地虎!!!
@time: 2021-03-27 14:23:40
-->
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="bootstrap-dist/css/bootstrap.css" />
    <script type="text/javascript" charset="utf-8">
        //下拉刷新
        mui.init({

        });
    </script>
    <style>
        .liushui{
            position: relative;
            font-size: 18px;
            left: 80px;
        }
        .list-group-item{
        }
        .list-group-item img{
            position: relative;
            top: -2px;
        }
    </style>
</head>
<body>
<!-- 侧滑导航根容器 -->
<div class="mui-off-canvas-wrap mui-draggable">
    <!-- 菜单容器 -->
    <aside class="mui-off-canvas-left">
        <div class="mui-scroll-wrapper" style="background-color: #efeff4;">
            <div class="mui-scroll">
                <!-- 菜单具体展示内容 -->
                <div class="container mt-3 border-bottom">
                    <div class="row ">
                        <div class="col-12"><img src="logo/mianxingzhangben%20(3).svg" alt=""></div>
                    </div>
                    <div class="row">
                        <div class="col-12"><span class="font-weight-normal" id="username" style="font-weight: 500">小羊会拉羊屎蛋</span></div>
                    </div>
                    <div>
                        <button type="button" id="QRBtn" class="h-auto border btn btn-outline-secondary" style="position: absolute;left: 220px;top: 25px;"><img src="img/QRCodeLogo2.svg" style="width: 16px;height: 16px;" alt=""></button>
                    </div>
                    <div class="row">
                        <div class="col-12"><span class="text-muted" id="userNum">18585850001</span></div>
                    </div>
                </div>
                <div class="container">
                    <ul class="row list-group list-group-flush mt-3">
                        <li class="list-group-item"><img src="logo/30jizhang.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>记账设置</span></li>
                        <li class="list-group-item"><img src="logo/30shouye.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>首页设置</span></li>
                        <li class="list-group-item"><img src="logo/30fenlei.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>分类标签</span></li>
                        <li class="list-group-item"><img src="logo/30yusuan.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>预算中心</span></li>
                        <li class="list-group-item"><img src="logo/30zijin.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>超级流水</span></li>
                    </ul>
                    <ul class="row list-group list-group-flush mt-3">
                        <li class="list-group-item"><img src="logo/30tubiao.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>图表分析</span></li>
                        <li class="list-group-item"><img src="logo/30zhuti.svg" alt="" style="width: 16px;height: 16px">&nbsp; <span>主题换肤</span></li>
                        <li class="list-group-item"><img src="logo/30gaojichaxun.svg" alt="" style="width: 16px;height: 16px">&nbsp; <span>高级功能</span></li>
                        <li class="list-group-item"><img src="logo/30fankui.svg" alt="" style="width: 16px;height: 16px">&nbsp;&nbsp;<span>求助反馈</span></li>
                        <li class="list-group-item text-center mt-3" style="color: yellow"><span>账本结转</span></li>
                    </ul>
                </div>
            </div>
        </div>
    </aside>
    <!-- 主页面容器 -->
    <div  class="mui-inner-wrap">
        <!-- 主页面标题 -->
        <header class="mui-bar mui-bar-nav">
            <h1 class="mui-title">首页</h1>
        </header>
        <div class="mui-content mui-scroll-wrapper" >
            <div class="mui-scroll">
                <div class="container mt-1">
                    <div class="row">
                        <div class="col-12">
                            <form class="form-inline my-2 my-lg-0">
                                <input class="form-control mr-sm-2" type="search" placeholder="搜索" aria-label="Search">
                            </form>
                        </div>
                    </div>
                    <div class="row">
                        <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                            <ol class="carousel-indicators">
                                <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
                                <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
                                <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
                            </ol>
                            <div class="carousel-inner">
                                <div class="carousel-item active">
                                    <img src="./img/background%20(1).jpg" class="d-block w-100" alt="...">
                                </div>
                                <div class="carousel-item">
                                    <img src="./img/background%20(2).jpg" class="d-block w-100" alt="...">
                                </div>
                                <div class="carousel-item">
                                    <img src="./img/background%20(3).jpg" class="d-block w-100" alt="...">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="alert alert-light col-12">
                            <h5 class="alert-heading"><img src="logo/day.svg" style="width: 16px;height: 16px" alt="">今天</h5>
                            <p>
                                <span id="daytext">今天你还没有记账，来记一笔吧！</span>
                                <span id="dayzhichu" class="liushui" style="color: #dc3545">0.00</span>
                                <span id="dayshouru" class="liushui" style="color: #28a745">0.00</span>
                            </p>
                        </div>
                        <div class="alert alert-light col-12">
                            <h5 class="alert-heading"><img src="logo/wenk2.svg" style="width: 16px;height: 16px" alt="">本周</h5>
                            <p>
                                <span id="zhoutext">本周你还没有记账，来记一笔吧！</span>
                                <span id="zhouzhichu" class="liushui" style="color: #dc3545">0.00</span>
                                <span id="zhoushouru" class="liushui" style="color: #28a745">0.00</span>
                            </p>
                        </div>
                        <div class="alert alert-light col-12">
                            <h5 class="alert-heading"><img src="logo/month3.svg" style="width: 16px;height: 16px" alt="">本月</h5>
                            <p>
                                <span id="monthtext">本月你还没有记账，来记一笔吧！</span>
                                <span id="yuezhichu" class="liushui" style="color: #dc3545">0.00</span>
                                <span id="yueshouru" class="liushui" style="color: #28a745">0.00</span>
                            </p>
                        </div>
                    </div>
                    <div class="row fixed-bottom mb-3 border-top" style="height: 50px;">
                        <div class="btn-group col-3 align-text-bottom " role="group" aria-label="First group">
                            <button type="button" id="shouYe" class="h-auto border btn btn-outline-secondary"><img src="logo/shouye.svg" style="width: 16px;height: 16px"  alt=""><br><span style="font-size: 12px">首页</span></button>
                        </div>
                        <div class="btn-group col-3" role="group" aria-label="Second group">
                            <button id="guanli" type="button" class="btn border-0 btn-outline-secondary"><img src="logo/guanli.svg" style="width: 16px;height: 16px"  alt=""><br><span style="font-size: 12px">管理</span></button>
                        </div>
                        <div class="btn-group col-3" role="group" aria-label="Third group">
                            <button id="lijinbu" type="button" class="btn border-0 btn-outline-secondary"><img src="logo/zhangben.svg" style="width: 16px;height: 16px"  alt=""><br><span style="font-size: 12px">礼金簿</span></button>
                        </div>
                        <div class="btn-group col-3" role="group" aria-label="Forth group">
                            <button id="myPage" type="button" class="btn border-0 btn-outline-secondary"><img src="logo/myself.svg" style="width: 16px;height: 16px"  alt=""><br><span style="font-size: 12px">我的</span></button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
<script src="bootstrap-dist/js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
<script src="bootstrap-dist/js/popper.min.js" type="text/javascript" charset="utf-8"></script>
<script src="bootstrap-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<script>
    $("#myPage").click(function () {
        window.location.href="MyPage.html";
    });
    $("#lijinbu").click(function () {
        window.location.href="BillPage.html";
    });
    $("#guanli").click(function () {
        window.location.href="guanLi.html";
    })
    $("#QRBtn").click(function () {
        mui.openWindow('QRCode.html');
    });
</script>
</html>
